<template>
	<view class="wrap">
		<!-- 基本信息 -->
		<view class="taskInfoBox">
			<view class="baseInfo u-flex">
				基本信息
			</view>
			<view class="taskInfo">
				<view>任务年度：</view>
				<view>{{ otherInfo.taskYear }}</view>
			</view>
			<view class="taskInfo">
				<view>任务类型：</view>
				<view>{{ otherInfo.taskTypeName }}</view>
			</view>
			<view>
				<view>任务标题：</view>
				<view class="other-content">{{ otherInfo.taskTitle }}</view>
			</view>
			<view>
				<view>任务内容：</view>
				<view class="other-content">{{ otherInfo.taskContent }}</view>
			</view>
		</view>

		<!-- 其他信息 任务进展 反馈信息  -->
		<view class="taskInfoBox">
			<u-tabs :list="list" :current="current" @change="changeTab" style="height: 90rpx;"></u-tabs>
			<view v-if="current == 0">
				<view v-if="otherInfo.feedbackWay" class="feedback-way">
					反馈要求：{{otherInfo.feedbackWay}}
				</view>
				<view v-if="otherInfo"  style="margin-top: 0;">
					<view class="taskInfo">
						<view>发起单位：</view>
						<view>{{ otherInfo.createOrgName }}</view>
					</view>
					<view class="taskInfo">
						<view>发布时间：</view>
						<view>{{ otherInfo.createDate }}</view>
					</view>
					<view class="taskInfo">
						<view>牵头领导：</view>
						<view>{{ otherInfo.taskLeaderName }}</view>
					</view>
					<view class="taskInfo">
						<view>牵头责任单位：</view>
						<view :class="otherInfo.taskLeaderOrgName && otherInfo.taskLeaderOrgName.length > 20 ? 'bk' : ''">{{ otherInfo.taskLeaderOrgName }}</view>
					</view>
				</view>
				<!-- 附件 -->
				<view class="lh-mt-36" style="margin-left:24rpx"><LhFilelist v-if="otherInfo.id" :bizKey="otherInfo.id" bizType="dcSupTaskInfo_file" /></view> 
			</view>
			<template v-else>	
				<view class="search">
					<u-search v-model="keywords" @custom="search" @search="search" placeholder="责任单位"></u-search>
				</view>
				<view v-if="current == 1">
					<view class="list-item u-flex u-row-between" v-for="item in progressList" :key="item.id">
						<view>{{item.leaderOrgName}}</view>
						<view>{{item.backlogType3}}</view>
					</view>
				</view>
				<view v-if="current == 2">
					<view class="list-item u-flex u-row-between" v-for="item in actionList" :key="item.id">
						<view>{{item.leaderOrgName}}</view>
						<view @click="navTo('/pages/task/taskAccount/feedbackDetail?id='+item.id + '&taskId=' + taskId)"><a>查看反馈</a></view>
					</view>
				</view>
			</template>
		</view>

		<u-loadmore v-if="current == 1 && progressList.length >= pageSize" :status="status"
			:load-text="loadText" />
		<u-loadmore v-if="current == 2 && actionList.length >= pageSize" :status="status2"
			:load-text="loadText" />

	</view>
</template>
<script>
	import LhFilelist from '@/components/lh-filelist/lh-filelist.vue';
	export default {
		components: {
			LhFilelist
		},
		data() {
			return {
				taskId: '',
				otherInfo: {
					taskYear: '',
					taskTitle: '',
					taskTypeName: '',
					taskContent: ''
				},
				keywords: '',
				progressList: [],
				progressListTem: [],
				actionList: [],
				actionListTem: [],
				pageSize: 5,
				pageNo: 1,
				count: 0,
				pageNo2: 1,
				count2: 0,
				status: 'loadmore',
				status2: 'loadmore',
				loadText: {
					loadmore: '加载更多',
					loading: '努力加载中',
					nomore: '我也是有底线的'
				},
				list: [{name: '其他信息'}, {name: '任务进展'}, {name: '反馈信息'}],
				current: 0
			};
		},
		onLoad(param) {
			this.taskId = param.id;
			// 其他信息
			this.$u.api.taskAccount.taskInfoOtherApp({
				taskId: param.id
			}).then(res => {
				if (res.info) {
					this.otherInfo = res.info;
				}
			})
			// 任务进展列表
			this.getTaskProgressInfo(this.pageNo, this.pageSize);
			// 反馈信息列表
			this.taskInfoActionListApp(this.pageNo2, this.pageSize);
			
		},
		onShow() {},
		methods: {
			changeTab(index) {
				this.keywords = "";
				this.current = index;
				this.search();
			},
			getTaskProgressInfo(no, size = 5) {
				this.$u.api.taskAccount.taskInfoProgressApp({taskId: this.taskId, pageNo: no, pageSize: size }).then(res => {
					if (res && res.list) {
						this.count = res.count;
						if (this.progressList && this.progressList.length > 0) {
							this.progressList = [...this.progressList, ...res.list]
						} else {
							this.progressList = res.list;
						}
						this.progressListTem = Object.assign([], this.progressList);
					}
				})
			},
			taskInfoActionListApp(no, size = 5) {
				this.$u.api.taskAccount.taskInfoActionListApp({taskId: this.taskId, pageNo: no, pageSize: size}).then(res => {
					if (res && res.list) {
						this.count2 = res.count;
						if (this.actionList && this.actionList.length > 0) {
							this.actionList = [...this.actionList, ...res.list]
						} else {
							this.actionList = res.list;
						}
						this.actionListListTem = Object.assign([], this.actionList);
					}
				})
			},
			search() {
				if (this.current == 1) {
					this.progressList = this.progressListTem.filter(item => item.leaderOrgName.indexOf(this.keywords) >= 0)
				} else if (this.current == 2) {
					this.actionList = this.actionListListTem.filter(item => item.leaderOrgName.indexOf(this.keywords) >= 0)
				}
			},
			navTo(url) {
				uni.navigateTo({
					url: url
				});
			}
		},
		onReachBottom() {
			if (this.current == 1) {
				if (this.progressList.length < this.count) {
					// 存在下一页
					this.pageNo += 1;
					this.status = 'loading';
					this.getTaskProgressInfo(this.pageNo, this.pageSize)
				} else if (this.progressList.length >= this.count) {
					this.status = 'nomore';
				}
			} else if(this.current == 2) {
				if (this.actionList.length < this.count2) {
					// 存在下一页
					this.pageNo2 += 1;
					this.status2 = 'loading';
					this.taskInfoActionListApp(this.pageNo2, this.pageSize)
				} else if (this.actionList.length >= this.count2) {
					this.status2 = 'nomore';
				}
			}
			
		}
	};
</script>
<style lang="scss">
	page {
		background-color: #f8f8f8;
	}
	.uni-scroll-view-content {
	    height: 0;
	}
	.taskInfoBox {
		background-color: #fff;
		margin: 20rpx 20rpx 0;
		padding: 20rpx;
		border-radius: 4rpx;
		&>view:last-child {
			border: none;
		}
		.baseInfo {
			height: 100rpx;
			color: #316ee6;
			font-weight: bold;
			border-bottom: 1px solid #f5f5f5;
		}
	}

	.taskInfo {
		&>view:first-child {
			width: 195upx;
		}
	}
	
	.other-content {
		color: #999;
		margin-top: 20rpx;
		margin-bottom: 20rpx;
		text-indent: 40rpx;
	}

	.list-item {
		padding: 30rpx 0;
		border-bottom: 1px solid #f8f8f8;
		&:last-child {
			border-bottom: none;
		}
		&>view:last-child {
			color: #999;
		}
		a {
			color: #316ee6;
			cursor: pointer;
			padding: 10rpx;
		}
	}

	.input {
		width: 170upx;
		height: 60upx;
		border: 1upx solid #333;
	}

	.bk {
		word-break: break-all;
		text-align: justify !important;
	}
	
	.feedback-way {
		background-color: $u-type-success-light;
		color: #316ee6;
		font-weight: bold;
		border-radius: 30rpx;
		padding: 8rpx 30rpx;
	}
</style>